<script lang="jsx" setup>
import { ref, watch } from 'vue';
import Form from '@/components/common/form.vue';

const props = defineProps({
  rowData: {
    type: Object,
    default: () => ({})
  },
  operateType: {
    type: String,
    default: () => 'add'
  }
});
// 左基本信息表单
const formList = [
  {
    type: 'input',
    key: 'techNo',
    label: '工艺编码',
    placeholder: '请输入工艺编码',
    span: 24,
    rule: {
      required: true,
      message: '请输入工艺编码',
      trigger: 'blur'
    }
  },
  {
    type: 'input',
    key: 'techName',
    label: '工艺名称',
    placeholder: '请输入工艺名称',
    span: 24,
    rule: {
      required: true,
      message: '请输入工艺名称',
      trigger: 'blur'
    }
  },
  {
    type: 'select',
    key: 'techType',
    label: '工艺类型',
    placeholder: '请选择工艺类型',
    span: 24,
    defaultValue: '0',
    selectOptions: [
      {
        value: '0',
        label: '一般工艺'
      },
      {
        value: '1',
        label: '成型工艺'
      },
      {
        value: '2',
        label: '压合工艺'
      },
      {
        value: '3',
        label: '包装工艺'
      },
      {
        value: '5',
        label: '钻孔工艺'
      },
      {
        value: '6',
        label: '阻抗测试工艺'
      },
      {
        value: '10',
        label: '空'
      }
    ]
  },
  {
    type: 'select',
    key: 'workUnit',
    label: '出账单位',
    placeholder: '请选择出账单位',
    span: 24,
    defaultValue: 'PNL',
    selectOptions: [
      {
        value: 'PNL',
        label: 'PNL'
      },
      {
        value: 'SET',
        label: 'SET'
      },
      {
        value: 'PCS',
        label: 'PCS'
      }
    ]
  },
  {
    type: 'radio',
    key: 'passOver',
    label: '需过数',
    span: 24,
    defaultValue: '1',
    selectOptions: [
      {
        value: '1',
        label: '是'
      },
      {
        value: '0',
        label: '否'
      }
    ]
  }
  // {
  //   type: 'inputNumber',
  //   key: 'passOverDays',
  //   label: '滞留报警(小时)',
  //   placeholder: '请输入滞留报警时长',
  //   span: 24,
  //   min: 0,
  //   max: 10000,
  //   step: 1,
  //   controls: true
  // },
  // {
  //   type: 'radio',
  //   key: 'q',
  //   label: '型号复制时复制制指示',
  //   span: 24,
  //   defaultValue: 1,
  //   selectOptions: [
  //     {
  //       value: 1,
  //       label: '是'
  //     },
  //     {
  //       value: 0,
  //       label: '否'
  //     }
  //   ]
  // },
  // {
  //   type: 'radio',
  //   key: 'q',
  //   label: '型号复制时复制制指示数据',
  //   span: 24,
  //   defaultValue: 1,
  //   selectOptions: [
  //     {
  //       value: 1,
  //       label: '是'
  //     },
  //     {
  //       value: 0,
  //       label: '否'
  //     }
  //   ]
  // },
  // {
  //   type: 'textarea',
  //   key: 'remark',
  //   label: '备注',
  //   placeholder: '请输入备注',
  //   span: 24
  // }
];

const formRef = ref(null);

const model = ref({});

function validateForm() {
  return formRef.value.validateForm();
}

// 监听 rowData 的变化
watch(
  () => props.rowData,
  newData => {
    console.log('newData', newData);

    if (newData && props.operateType === 'edit') {

      model.value = { ...newData };
    } else {
      model.value = {
        techNo: '',
        techName: '',
        techType: '0',
        workUnit: 'PNL',
        passOver: '1'
      };
    }
  },
  { immediate: true, deep: true }
);

defineExpose({
  model: model.value,
  validateForm
});
</script>

<template>
  <div class="container">
    <div class="event-form">
      <Form ref="formRef" v-model:model="model" :form-list="formList"></Form>
    </div>
  </div>
</template>

<style lang="scss" scoped></style>
